<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>招聘</title>
    <link rel="stylesheet" href="css/jquery.fullPage.css">
    <link rel="stylesheet" href="css/index.css">
   	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=dRGvTBglpnw9d328WIiXzoQC3xeseKlu"></script>
</head>
<body>
    <div id="container">
        <div class="section page1">
            <!-- 进来的背景 -->
            <div class="page1_bg bg1"></div>
            <div class="page1_bg bg2"></div>
            <div class="page1_bg bg3"></div>
            <div class="page1_bg bg4"></div>
            <!-- 旋转的浅色条 -->
            <div class="page1_img">
                <img src="img/page1/page1_white.png" alt="">
            </div>
            <!--深灰色条 -->
            <div class="page1_grey"></div>
            <!-- 黄色背景 -->
            <div class="page1_yellow">
                <img src="img/page1/page1_yellow.png" alt="">
            </div>
            <!-- 滚动的蓝色球 -->
            <div class="page1_ball">
                <img src="img/page1/page1_ball.png" alt="">
            </div>
            <!-- RIO2016 -->
            <div class="page1_rio">
                <img src="img/page1/page1_rio.png" alt="">
            </div> 
            <div class="page1_person">
                <div class="page1_people">
                    <img src="img/page1/page1_person.png" alt="">
                </div>
            </div>
            <!-- i want you -->
            <div class="page1_want">
                <div class="page1_image">
                    <img src="img/page1/page1_want.png" alt="">
                </div>
            </div>
            <!-- 文字 -->
            <div class="page1_text">
               <h3>企业秀招聘</h3>
               <p>程序猿</p>
               <p>文员</p>
               <p>运营</p>
               <p>设计师</p>
            </div>
        </div>
        <div class="section page2">
            <p class="page2_text1"><span>设计师</span>越努力,越自由</p>
            <p class="page2_text2"><span>设计师</span>越努力,越自由</p>
            <p class="page2_text3">脑洞大有创意有想法</p>
            <p class="page2_text4">脑洞大有创意有想法</p>
            <div class="page2_img1">
                <img src="img/page2/page2_round1.png" alt="">
            </div>
            <div class="page2_img2">
                <img src="img/page2/page2_round.png" alt="">
            </div>
            <div class="page2_circle1"></div>
            <div class="page2_circle2"></div>
            <div class="page2_p">
                    <p>5年以上的工作经验</p>
                    <p>带有团队经验</p>
                    <p>主导设计至少一款上线并经过版本迭代的移动端产品</p>
                    <p>
                        熟悉使用photoshop
                        <br>
                        illustrator
                        <br>
                        AE
                        <br>
                        Axure
                        <br>
                        等设计软件
                    </p>
            </div>
        </div>
        <div class="section page3">
            <div class="page3_bg1"></div>
            <div class="page_left"></div>
            <div class="page_middle"></div>
            <div class="page_right"></div>
            <div class="page_last"></div>
            <div class="page3_bg2"></div>
            <div class="page3_text">
                <h2>运营</h2>
                <p>要精准也要速度</p>
            </div>
            <div class="page3_text1">
                <p>.3~5年互联网的相关运营经验，善于整合各种资源，熟悉2B市场优先。</p>
                <p>.有ICP/ISP/公有云行业经验优先，在开源社区活跃并有良好的人际关系优先。</p>
                <p>.具有较强的分析、营销、策划、推广能力优先。</p>
                <p>.对数据敏感，善于发掘数据的优先。</p>
            </div>
            <div class="page3_run">
                <img src="img/page3/page3_run.png" alt="" >
            </div>
            <div class="page3_run1">
            	<img src="img/page3/page3_run1.png" alt="">
            </div>
            <div class="page3_run2">
            	<img src="img/page3/page3_run1.png" alt="" >
            </div>
             <div class="page3_run3">
            	<img src="img/page3/page3_run1.png" alt="" >
            </div>
             <div class="page3_run4">
            	<img src="img/page3/page3_run1.png" alt="" >
            </div>
        </div>
        <div class="section page4 ">
            <div class="page4_blue">
                <div class="page4_img1">
                    <img src="img/page4/page4_blue1.png" alt="">
                </div>
                <div class="page4_img">
                    <img src="img/page4/page4_blue.png" alt="" >
                </div>
            </div>
        	<div class="page4_bg1"></div>
        	<div class="page4_bg2"></div>
        	<div class="page4_bg3"></div>
        	<div class="page4_person">
        		<img src="img/page4/page4_bg.png" alt="" />
        	</div>
        	<div class="page4_text">
        		<ul>
        			<li>熟悉PHP+MYSQL或.NET其中一种编程语言，能独立开发网站</li>
        			<li>熟悉XML、javascript、XSL、HTML5、DIV+CSS、JQUERY</li>
        			<li>熟悉跨平台的socket编程,熟悉TCP/IP协议，熟悉多线程编程</li>
        			<li>逻辑清晰，责任感强，学习能力强，团队协作能力强</li>
        		</ul>
        	</div>
        	<div class="page4_txt">
        		<h2>后端工程师</h2>
        		<h3>变的是花样，不变的是稳定</h3>
        	</div>
        	<div class="page4_t">
        		<img src="img/page4/page4_bg1.png" alt="" />
        	</div>
        	<div class="page4_t1">
        		<img src="img/page4/page4_bg1.png" alt="" />
        	</div>
        	<div class="page4_t2">
        		<img src="img/page4/page4_bg1.png" alt="" />
        	</div>
        </div>
        <div class="section page5">
        	<div class="page5_bg"></div>
        	<div class="page5_round1">
        		<img src="img/page5/page5_round1.png" alt="" />
        	</div>
        	<div class="page5_round2">
        		<img src="img/page5/page5_round2.png" alt="" />
        	</div>
        	<div class="page5_round3">
        		<img src="img/page5/page5_round5.png" alt="" />
        	</div>
        	<div class="page5_round4">
        		<img src="img/page5/page5_round4.png" alt="" />
        	</div>
        	<div class="page5_round5">
        		<img src="img/page5/page5_round3.png" alt="" />
        	</div>
        	<div class="page5_head1">
        		<img src="img/page5/page5_head1.png"/>
        	</div>
        	<div class="page5_head2">
        		<img src="img/page5/page5_head2.png"/>
        	</div>
        	<div class="page5_head3">
        		<img src="img/page5/page5_head3.png"/>
        	</div>
        	<div class="page5_head">
        		<img src="img/page5/page5_head.png" alt="" />
        	</div>
        	<div class="page5_text">
        		<div class="page5_txt">
        			<ul>
		    			<li>深入了解W3C标准与SE规范，熟悉web语义化</li>
		    			<li>需要有html5+css3开发经验</li>
		    			<li>了解es6规范</li>
		    			<li>熟悉了解各种调试抓工具，能熟悉分析解决归纳问题</li>
		    		</ul>
        		</div>
        	</div>
        	<div class="page5_title">
        		<h2>前端工程师</h2>
        		<h3>敢为先天下</h3>
        	</div>
        </div>
        <div class="section page6">
        	<div class="page6_bg">
        		<img src="img/page6/page6_bg.png" alt="" />
        	</div>
        	<div class="page6_text"></div>
        	<div class="page6_p">
        		我们的福利
        	</div>
        	<div class="page6_tip">
        		<ul>
        			<li>一年十三薪</li>
        			<li>餐饮补贴</li>
        			<li>交通补贴</li>
        			<li>话费补贴</li>
        		</ul>
        	</div>
        </div>
        <div class="section page7">
        	<div class="page7_bg"></div>
        	 <!-- 旋转的浅色条 -->
            <div class="page1_img">
                <img src="img/page1/page1_white.png" alt="">
            </div>
            <!-- 黄色背景 -->
            <div class="page1_yellow">
                <img src="img/page1/page1_yellow.png" alt="">
            </div>
            <!-- 滚动的蓝色球 -->
            <div class="page1_ball">
                <img src="img/page1/page1_ball.png" alt="">
            </div>
             <div class="page1_person">
                <div class="page1_people">
                    <img src="img/page1/page1_person.png" alt="">
                </div>
            </div>
			<div class="page7_title">
				<div class="page7_tel">求职热线</div>
				<p>北京市紫金数码园4号楼201</p>
			</div>
			<div class="page7_blank" id="allmap"></div>
        </div>
        <div class="section page8">
        	<div class="page8_bg">
        		<img src="img/page7/page7_bg.jpg" alt="" />
        	</div>
        	<div class="page8_pic1">
        		<img src="img/page7/page7_person.png" alt="" />
        	</div>
        	<div class="page8_pic2">
        		<img src="img/page7/page7_color.gif" alt="" />
        	</div>
        	<div class="page8_pic3">
        		<img src="img/page7/page7_animal.jpg" alt="" />
        	</div>
        	<div class="page8_text">
        		精彩内容<br />不容错过
        	</div>
        </div>
        <div class="section page9">
        	<div class="page9_bg">
        		<img src="img/page8/page8_bg.jpg" alt="" />
        	</div>
        	<div class="page9_black"></div>
        	<div class="page9_head">
        		<img src="img/page8/page8_bg.jpg" alt="" />
        	</div>
        	<div class="page9_text">
        		招聘--2018与强者相遇
        	</div>
        	<div class="page9_more">
        		<input type="button" value="查看更多>"/>
        	</div>
        </div>
    	
    </div>
        <div id="page_btn">
            <img src="img/btn.svg" alt=""  class="page_btn" />
        </div>
    	
		<audio class="music" id="bg-music"  autoplay="" loop="" src="media/yujian.mp3"  type="video/mp3" preload=""></audio>
</body>
<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/jquery.fullPage.js"></script>
<script>
    document.getElementsByTagName("body")[0].style.opacity=1;
    $("#container").fullpage({
       
        // navigation:true,
        tochSensitivity:50,
        afterRender:function(){
            $(".section").eq(0).addClass("act");
        },
        afterLoad:function(anchorIndex,index){
                // if(index == 1){
                //     $(".section").eq(0).addClass("act");
                // }
                // if(index == 2){
                //     $(".section").eq(1).addClass("act");
                // }
                // if(index == 3){
                //     $(".section").eq(2).addClass("act");
                // }
                $(".section").removeClass("act").eq(index-1).addClass("act");
        }
    });
    // $("body").css({
    //     display:"block"
    // })
    // $(".section").eq(0).addClass("active")
    
    
	var map = new BMap.Map("allmap");    // 创建Map实例
	map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);  // 初始化地图,设置中心点坐标和地图级别
	//添加地图类型控件
	map.addControl(new BMap.MapTypeControl({
		mapTypes:[
            BMAP_NORMAL_MAP,
            BMAP_HYBRID_MAP
        ]}));	  
	map.setCurrentCity("北京");          // 设置地图显示的城市 此项是必须设置的
	map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
	
	
	$('#page_btn').toggle(function(){
		$('.music').get(0).pause();
        $(this).children().removeClass('page_btn');
		
	},function(){
		$('.music').get(0).play();
        $(this).children().addClass("page_btn");
	});


    function audioAutoPlay(id){  
		    var audio = document.getElementById(id),  
		        play = function(){  
		            audio.play();  
		            document.removeEventListener("touchstart",play, false);  
		        };  
		    audio.play();  
		    document.addEventListener("WeixinJSBridgeReady", function () {  
		        play();  
		    }, false);  
		    document.addEventListener('YixinJSBridgeReady', function() {  
		        play();  
		    }, false);  
		    document.addEventListener("touchstart",play, false);  
		}  
		audioAutoPlay('bg-music');	//传入audio标签的id名

</script>
</html>
<!-- 首屏的动画，在加载时和fullpage创建的，已经将active添加到页面中了，有可能出现首屏
样式成功写入，但无过渡效果-->